﻿@using Newtonsoft.Json
@using User.Global.Constvalues
@using User.Global.Constvalues.Web.Navigation
@using User.Web.Models.Admin
@{
    ViewBag.Title = PageTitles.MemberList;
}


<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-lg-6">
                        <h4>@ViewBag.Title (<!--ko text: FilterMemberCount --><!--/ko-->/<!--ko text: MaxMemberCount --><!--/ko-->)</h4>
                    </div>
                    <div class="col-lg-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-search"></i></span>
                            <input class="form-control" id="filterText" placeholder="@DefaultMessages.InputFilterValues" type="text" />
                        </div>
                    </div>
                </div>
            </div>

            <div class="panel-body">
                <div class="row livePanel">
                    <div class="col-lg-12">

                        <table class="table table-striped table-hover" id="filtertable">
                            <thead>
                                <tr>
                                    <th>
                                        @InputFieldNames.Username
                                    </th>
                                    <th>
                                        @InputFieldNames.Firstname
                                    </th>
                                    <th>
                                        @InputFieldNames.Lastname
                                    </th>
                                    <th>
                                        @InputFieldNames.LastLoginDate
                                    </th>
                                    <th>
                                        @InputFieldNames.Active
                                    </th>
                                    <th>
                                        @InputFieldNames.HasProvider
                                    </th>
                                    <th>
                                        &nbsp;
                                    </th>
                                </tr>
                            </thead>
                            <!-- ko if: MemberList().length > 0 -->
                            <tbody data-bind="foreach: MemberList">
                                <tr>
                                    <td data-bind="text: Loginname"></td>
                                    <td data-bind="text: Firstname"></td>
                                    <td data-bind="text: Lastname"></td>
                                    <td data-bind="text: LastLoginDateString"></td>
                                    <td data-bind="text: IsActiveAccount"></td>
                                    <td data-bind="text: HasProvider"></td>
                                    <td>
                                        <a data-bind="attr: { href: '/@EController.Admin.ToString()/@EActionAdministration.MemberEditAdmin.ToString()/' + Id() }" title="Benutzer bearbeiten" href="#"><i class="fa fa-pencil-square-o fa-lg"></i></a>
                                        <a data-bind="attr: { href: '/@EController.Admin.ToString()/@EActionAdministration.MemberDetails.ToString()/' + Id() }" title="Benutzer Details" href="#"><i class="fa fa-file-text-o fa-lg"></i></a>
                                        <a data-bind="attr: { href: '/@EController.Admin.ToString()/@EActionAdministration.MemberRights.ToString()/' + Id() }" title="Benutzer Rechte" href="#"><i class="fa fa-cogs fa-lg"></i></a>
                                    </td>
                                </tr>
                            </tbody>
                            <!--/ko-->
                            <!-- ko if: MemberList().length === 0 -->
                            <tbody>
                                <tr>
                                    <td colspan="7">
                                        <h4 class="text-center">
                                            @DefaultMessages.NoEntriesFound
                                        </h4>
                                    </td>
                                </tr>
                            </tbody>
                            <!--/ko-->
                        </table>
                        <!--/ko-->
                    </div>
                </div>
            </div>

            <div class="panel-footer">
                &nbsp;
                <!-- ko if: MemberList().length >= @ConstLengthValues.MaxTakeItemEntries -->
                Es wurden mehr Einträge gefunden (<!--ko text: @ConstLengthValues.MaxTakeItemEntries --><!--/ko-->/<!--ko text: MaxMemberCount --><!--/ko-->), als angezeigt werden. Bitte filtern Sie die Daten entsprechend.
                <!--/ko-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-lg-12">
        <hr />
    </div>
</div>


@section scripts
{
    @Scripts.Render("~/bundles/knockout")

    <script>

        function MemberListViewModel(optionsData) {
            this.searchField = $("#filterText"),
            this.liveUpdate = $(".livePanel"),
            this.viewModel = undefined,
            //Registrieren aller verwendeten Events in unserem View
            this.registerEvents = function() {
                var that = this;
                that.searchField.keyup(function(e) {
                    //Nicht direkt mit der Suche nach dem Stichwort beginnen erst ein kurzes Delay abwarten
                    setTimeout(function() {
                        that.options.jsonFilterData.FilterString = that.searchField.val();
                        that.GetFilterData();
                    }, 300);
                });
            },
            this.initialize = function() {
                //Vergleichen der Optionen und zusammenführen der Optionen zu einem Objekt, damit müssen
                //beim Initialisieren nicht immer alle Optionsparameter gesetzt werden.
                this.options = $.extend({}, this.options, optionsData);
                this.viewModel = ko.mapping.fromJS(this.options.viewModelData);
                ko.applyBindings(this.viewModel);

                //Zum Debuggen von KnockoutJs man sieht das komplette Objekt welches zur Verfügung steht
                //http://www.knockmeout.net/2013/06/knockout-debugging-strategies-plugin.html
                var data = ko.dataFor(document.body);

                this.registerEvents();
                //Laden unserer Anzeigedaten
                this.LoadData(this.options.jsonFilterData);
            };
        }

        //Optionen die wir setzten können, hier müssen nicht alle gesetzt werden, nur die wir wollen
        //sonst wird der hier eingetragenene wert als Standard verwendet
        MemberListViewModel.prototype.options = {
            viewModelData : {"MemberList":[]},
            ajaxLoadDataBaseUrl: "/api/AdminApi/",
            jsonFilterData: {
                FilterString: ''
            },
        };

        //Die aktuellen Anzeigedaten vom KO Model aktualisieren
        MemberListViewModel.prototype.RefreshViewModelListData = function(daten) {
            ko.mapping.fromJS(daten, this.viewModel);
            var data = ko.dataFor(document.body);
        };

        //Ermittelnt die Filterdaten für unseren View per AJAX
        MemberListViewModel.prototype.GetFilterData = function () {
            this.LoadData(this.options.jsonFilterData);
        };

        //Prototype Function, um die Einträge nach den zu letzt hinzugefügten Einträgen zu ermitteln
        MemberListViewModel.prototype.LoadData = function (filterData) {
            var that = this;
            //Unser filterDataObjekt noch in den passenden JSON String umwandeln.
            filterData = JSON.stringify(filterData);
            $.ajax({
                //url: that.options.ajaxLoadDataBaseUrl,
                url: that.options.ajaxLoadDataBaseUrl + "MemberListFilter",
                type: "POST",
                data: filterData,
                contentType: 'application/json; charset=utf-8',
                statusCode: {
                    200 /* OK */: function (daten) {
                        that.RefreshViewModelListData(daten);
                    },
                    401:  /* Nicht autorisierter Zugriff */ function () {
                        location.href = "/Home/Index";
                    }
                }
            });
        };

        var viewModel = new MemberListViewModel({
            viewModelData: @(Html.Raw(JsonConvert.SerializeObject(new MemberListApiModel())))
            });

        viewModel.initialize();

    </script>

}
